@import "./normalize.css";
@import "./font-awesome.css";
@import '../mixins/mixins.scss';
/* :root ->获取根元素 html */
:root {
  /* 定义 css 变量 */
  --color-text: #666;
  --color-text-highlight: #c0c4cc;
  --color-border: #e3e3e3;
  --color-background-white: #fff;
  --color-background-grey: #f5f5f5;
  --font-size-16: 16px;
  --font-size-14: 14px;
  --font-size-12: 12px;
  --line-height: 1.5;
}
*,*::before,*::after {
  margin: 0; padding: 0; box-sizing: border-box;
}
html,body{
  width: 100%;
  height: 100%;
  overflow: hidden;
}
body {
  font-family: Arial, Helvetica, sans-serif;
  font-size:var(--font-size-14);
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  color: var(--color-text);
  width: 100vm;
}

/* 滚动条样式 */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track-piece { background-color: transparent; }
body::-webkit-scrollbar-track-piece { background-color: transparent; }
// ::-webkit-scrollbar-track-piece:no-button { }
::-webkit-scrollbar-thumb { cursor: pointer; margin-right: 1px; transition: 0.3s background-color; background-color: rgba(144, 147, 153, 0); border-radius: 3px; }
:hover::-webkit-scrollbar-thumb { background-color: rgba(144, 147, 153, 0.3); }
::-webkit-scrollbar-thumb:hover { background-color: rgba(144, 147, 153, 0.5); }
::-webkit-scrollbar-thumb:active { background-color: rgba(144, 147, 153, 0.7); }
::-webkit-scrollbar-button:vertical { width: 0; height: 0; }
::-webkit-scrollbar-button:horizontal { width: 0; height: 0; }
::-webkit-scrollbar-button:vertical:start:decrement { background-color: transparent; }
::-webkit-scrollbar-button:vertical:end:increment { background-color: transparent; }
::-webkit-scrollbar-button:horizontal:start:decrement { background-color: transparent; }
::-webkit-scrollbar-button:horizontal:end:increment { background-color: transparent; }

/*布局--浮动*/
.fl { float: left !important; }
.fr { float: right !important; }
.fn { float: none !important; }
.clearfix{ @include clearfix; }

/*布局--定位*/
.posa { position: absolute !important; }
.posr { position: relative !important; }
.poss { position: static !important; }
.posf { position: fixed !important; }

/*布局--转换*/
.dispn { display: none !important; }
.dispb { display: block !important; }
.displ { display: inline !important; }
.dispi { display: inline-block !important; }
.dispt { display: table !important; }
.dispc { display: table-cell; vertical-align: middle; text-align: center; }

/*布局--显隐*/
.ovfh { overflow: hidden !important; }
.ovfa { overflow: auto !important; }
.ovfs { overflow: scroll !important; }
.ovfsx { overflow-x: scroll !important; }
.ovfsy { overflow-y: scroll !important; }

/*布局--对齐*/
.textc { text-align: center !important; }
.textl { text-align: left !important; }
.textr { text-align: right !important; }
.textj { text-align: justify !important; }
.textj:after { display: inline-block; content: ""; width: 100%; height: 0; visibility: hidden; }

/* 字体--粗细 */
.fw-3 { font-weight: 300 !important; }
.fw-5 { font-weight: 500 !important; }
.fw-b { font-weight: bold !important; }
/* 字体--尺寸 */
@include gen-fontsize;

/* 宽度 */
.w-100 { width: 100% !important; }
.h-100 { height: 100% !important; }
.wh-max100 { max-width: 100%; max-height: 100%; }
.w-50 { width: 50% !important; }
.w-33 { width: 33.33% !important; }
.w-25 { width: 25% !important; }
.w-20 { width: 20% !important; }
.w-e1 { width: 1em !important; }
.w-e2 { width: 2em !important; }
.w-e3 { width: 3em !important; }
.w-e4 { width: 4em !important; }
.w-e5 { width: 5em !important; }
.w-e6 { width: 6em !important; }
.w-e7 { width: 7em !important; }
.w-e8 { width: 8em !important; }
.w-e9 { width: 9em !important; }
.w-e10 { width: 10em !important; }
.w-e15 { width: 15em !important; }

/* 边距 */
.mar-auto { margin: 0 auto !important; }
@include gen-margin(margin,left);
@include gen-margin(margin,right);
@include gen-margin(margin,top);
@include gen-margin(margin,bottom);
@include gen-margin(margin,all);
@include gen-margin(margin,horizontal);
@include gen-margin(margin,vertical);
@include gen-margin(padding,left);
@include gen-margin(padding,right);
@include gen-margin(padding,top);
@include gen-margin(padding,bottom);
@include gen-margin(padding,all);
@include gen-margin(padding,horizontal);
@include gen-margin(padding,vertical);

/* 颜色 */
.colr-primary {
  color: #409EFF;
}
.colr-success {
  color: #67C23A;
}
.colr-error {
  color: #F56C6C;
}
.colr-warning {
  color: #E6A23C;
}
.colr-info {
  color: #909399;
}